/*
 * @Author: xiaosihan 
 * @Date: 2024-06-25 02:32:31 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2024-07-23 22:33:26
 */

import { autorun } from "mobx";
import { ReactNode, useEffect, useRef, useState } from "react";
import styles from "./loginModal.module.less";
import { Modal } from "antd";
import WXLogin from "./WXLogin/WXLogin";
import loginStore from "./loginStore";
import PhoneLogin from "./PhoneLogin/PhoneLogin";
import userStore from "@views/userStore";

interface Iprops {
    children?: ReactNode
}

// 登录弹窗 劲量做成pc mobile 两用的
export default function LoginModal() {

    const [loginType, setLoginType] = useState(loginStore.loginType);
    const [showLoginModal, setShowLoginModal] = useState(loginStore.showLoginModal);

    useEffect(() => {
    }, []);

    useEffect(() => autorun(() => {
        setLoginType(loginStore.loginType);
        setShowLoginModal(loginStore.showLoginModal && !userStore.isLogin);
    }), []);

    return (
        <Modal
            open={showLoginModal}
            centered={true}
            footer={null}
            maskClosable={false}
            width={400}
            onCancel={() => loginStore.setShowLoginModal(false)}
        >

            {/* 微信登录 */}
            {loginType === "wx_login" && <WXLogin />}


            {/* 电话号码登录 */}
            {loginType === "sms_login" && <PhoneLogin />}


        </Modal>
    );

}